<!-- 技术评估 -->
<template>
  <div>
    <Card :bordered="false">
      <p slot="title">技术评估</p>
      <table id="pgb" width='100%' border="1" cellspacing="0" cellpadding="0" ref="print">
        <tr>
          <th colspan="4">
            技术评估表
          </th>
        </tr>
        <tr>
          <td width="25%">
            项目名称</td>
          <td colspan="3">
            <Input v-model="info.Project_name" />
          </td>
        </tr>
        <tr>
          <td width="25%">项目编号</td>
          <td colspan="3">
            {{info.Project_number}}
          </td>
        </tr>
        <tr>
          <td width="25%">建设单位</td>
          <td colspan="3">
            <Input v-model="info.Build_unit" />
          </td>
        </tr>
        <tr>
          <td width="25%">建设地点</td>
          <td colspan="3">
            <Input v-model="info.Build_address" />
          </td>
        </tr>
        <tr>
          <td width="25%">报告类型</td>
          <td colspan="3">
            <Input v-model="info.Report_type" />
          </td>
        </tr>
        <tr>
          <td width="25%">技术评估时间</td>
          <td width="25%">
            <Input v-model="value4" icon="ios-clock-outline" placeholder="" style="width: 200px" />
          </td>
          <td width="25%">
            技术评估会议地点
          </td>
          <td width="25%">
            <Input v-model="info.Appraise_address" />
          </td>
        </tr>
        <tr>
          <td>
            评估专家
          </td>
          <td colspan="3">
          </td>
        </tr>
        <tr>
          <td width="25%" rowspan="2">
            评估意见
          </td>
          <td colspan="3" style="padding:0 2px;">
            <div style="width:99%;margin:auto;height:100%;">
              <Table border ref="selection" style="border: none" :columns="appraiseListsOption" :data="appraiseList"></Table>
            </div>
            <Row>
              <Col span="24" style="text-align: center;padding:10px">
              <Button type="primary" @click="inputAdd('appraiseList')">添加</Button>
              <Button type="error">删除</Button>
              </Col>
            </Row>
          </td>
        </tr>
        <tr>
          <td>
            专家评估意见
          </td>
          <td colspan="2">
            <Upload action="//jsonplaceholder.typicode.com/posts/">
              <Button>上传</Button>
            </Upload>
            上传专家意见和专家签名表，上传文件格式为docx、doc、PDF、WPS、图片
          </td>
        </tr>
        <tr>
          <td>
            评估意见修改单
          </td>
          <td colspan="3">
            <div style="width:99%;margin:auto;height:100%;">
              <Table border style="border: none" :columns="appraiseListsOptionXg" :data="appraiseListXg"></Table>
            </div>

          </td>
        </tr>
        <tr>
          <td>
            修改后报告
          </td>
          <td colspan="3" style="padding:20px">
            <Upload action="//jsonplaceholder.typicode.com/posts/">
              <Button>上传</Button>
            </Upload><br>
            上传专家意见和专家签名表，上传文件格式为docx、doc、PDF、WPS、图片
          </td>
        </tr>
      </table>
      <Row style="padding:20px 0">
        <Col span="4">
        <Button type="primary" @click="print">打印</Button>

        </Col>
        <Col span="20" style="text-align:right">
        <Button type="primary" @click="submit('save')">保存</Button>
        <Button type="primary" @click="submit('submit')">提交报批</Button>
        </Col>
      </Row>
      <StepBar :status="6" />
    </Card>
    <Modal footer-hide v-model="modalPrint" title="请选择打印需求">
      <Row style="padding-bottom:30px">
        <Col span="12" style="text-align:center">
        <p>打印技术评估表</p>
        <PrintButton v-if="flag" Url="print/printAppraise" :Project_id="info.Id"></PrintButton>
        </Col>
        <Col span="12" style="text-align:center">
        <p>打印修改清单</p>
        <PrintButton v-if="flag" Url="print/printAppraiseChange" :Project_id="info.Id"></PrintButton>
        </Col>
      </Row>
    </Modal>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        modalPrint: false,
        flag: false,
        value4: "",
        info: {},
        /* 专家意见 */
        appraiseListsOption: [{
            align: "center",
            width: 80,
            title: "序号",
            type: 'index'
          },
          {
            align: "center",
            title: "专家评估意见",
            key: "Appraise_opinion",
            render: (h, {
              row,
              index
            }) => {
              return h("Input", {
                props: {
                  type: "text",
                  value: row.Appraise_opinion
                },
                on: {
                  "on-blur": val => {
                    this.appraiseList[index].Appraise_opinion = val.target.value;
                    this.appraiseList[index]["Project_id"] = this.$route.query.Project_id || this.$route.query
                      .id;
                    this.appraiseListXg = this.appraiseList
                  }
                }
              });
            }
          }
        ],
        appraiseList: [],
        /* 专家修改意见 */
        appraiseListsOptionXg: [{
            align: "center",
            width: 80,
            title: "序号",
            type: 'index'
          },
          {
            align: "center",
            title: "专家评估意见",
            key: "Appraise_opinion",
            render: (h, {
              row,
              index
            }) => {
              return h("Input", {
                props: {
                  type: "text",
                  value: row.Appraise_opinion
                },
                on: {
                  "on-blur": val => {
                    this.appraiseListXg[index].Appraise_opinion = val.target.value;
                    this.appraiseListXg[index][
                      "Project_id"
                    ] = this.$route.query.Project_id || this.$route.query.id;
                  }
                }
              });
            }
          },
          {
            align: "center",
            title: "修改说明",
            key: "Revise_explain",
            render: (h, {
              row,
              index
            }) => {
              return h("Input", {
                props: {
                  type: "text",
                  value: row.Revise_explain
                },
                on: {
                  "on-blur": val => {
                    this.appraiseListXg[index].Revise_explain = val.target.value;
                  }
                }
              });
            }
          },
        ],
        appraiseListXg: [],
      };
    },
    created() {
      let query = this.$route.query
      this.query = query
      this.getProject(this.query.id)
    },
    methods: {
      print() {
        this.modalPrint = true
      },
      //点击添加意见
      inputAdd(type) {
        this.appraiseListXg = []
        this[type].push({})
      },
      // 意见发送
      appraiseListFn() {
        let appraiseList = this.appraiseList;
        axios.post("appraise/saveOrUpdate", {
          appraiseList
        }).then(res => {}).catch(err => {
          alert('发送意见失败')
        })
      },
      /* 获取当前创建项目 */
      getProject(id) {
        axios.get('/projectInformation/findProjectByID', {
          params: {
            id: id || this.$route.query.Project_id
          }
        }).then(res => {
          console.log(res)
          this.info = res.info
          this.appraiseList = res.appraiseList
          localStorage.projectType = this.info.Perject_type
          this.flag = true
        }).catch(err => {
          alert('请求崩溃1231')
        })
      },
      submit(type) {
        this.appraiseListFn()
        let info = this.info
        let appraiseListXg = this.appraiseListXg
        let appraiseList = this.appraiseList
        info.btn_way = type == 'save' ? 1 : 2
        info.Perject_type = type == 'save' ? 12 : 12

        axios.post('/projectInformation/saveOrUpdateProject', info).then((res) => {
          if (res._STATUS == 1) {

            let title = res._MESSAGE
            if (type == 'save') {
              this.$Modal.success({
                title,
              })
            } else {
              this.$router.push({
                name: "reportApproval",
                query: {
                  id: this.$route.query.id || this.$route.query.Project_id
                }
              })
            }
          } else {
            // 提示
            this.$Modal.error({
              title,
            })
          }
        }).catch(err => {
          alert('炸了')
        })
      }
    }

  };
</script>
<style lang="less">
  #pgb {
    .ivu-input {
      border: none !important;
      text-align: center;
      height: 30px;

      input {
        outline: medium;
      }
    }
  }
</style>